<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="Author" content="只会切图的前端">
    <title>html+css制作圣诞树</title>
    <link rel="stylesheet" href="sds01.css"/>
</head>
<body>
<p class="word">Merry Christmas</p>
<div class="tree">
    <div class="star">
        <div class="star-in"></div>
    </div>
    <!--树叶-->
    <div class="leaf-box">
        <div class="leaf">
            <div class="edge"></div>
            <div class="edge right"></div>
        </div>
        <div class="leaf">
            <div class="edge"></div>
            <div class="edge right"></div>
        </div>
        <div class="leaf">
            <div class="edge"></div>
            <div class="edge right"></div>
        </div>
        <div class="leaf">
            <div class="edge"></div>
            <div class="edge right"></div>
        </div>
        <div class="leaf">
            <div class="edge"></div>
            <div class="edge right"></div>
        </div>
    </div>
    <!--树干-->
    <div class="trunk"></div>
    <!--彩色的球-->
    <div class="ball-box">
        <div class="ball b1"></div>
        <div class="ball b2"></div>
        <div class="ball b3"></div>
        <div class="ball b4"></div>
        <div class="ball b5"></div>
        <div class="ball b6"></div>
        <div class="ball b7"></div>
        <div class="ball b8"></div>
        <div class="ball b9"></div>
    </div>
    <!--闪烁--->
    <div class="sparkle">
        <span>✦</span>
        <span>✦</span>
        <span>✦</span>
        <span>✦</span>
        <span>✦</span>
        <span>✦</span>
    </div>
    <div class="blink">
        <div></div>
        <div></div>
        <div></div>
        <div></div>
        <div></div>
        <div></div>
    </div>
</div>
</body>
</html>
